﻿<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="../helpproject.xsl" ?>
<topic template="Default" lasteditedby="Geert" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../helpproject.xsd">
  <title translate="true">MVVM behaviors</title>
  <keywords>
    <keyword translate="true">Behaviors</keyword>
    <keyword translate="true">MVVM</keyword>
    <keyword translate="true">MVVM behaviors</keyword>
  </keywords>
  <body>
    <header>
      <para styleclass="Heading1"><text styleclass="Heading1" translate="true">MVVM behaviors</text></para>
    </header>
    <para styleclass="Normal"><text styleclass="Normal" translate="true">Starting with Catel 2.0, it is possible to use the logic of the following controls as a behavior:</text></para>
    <list id="1" type="ul" listtype="bullet" formatstring="·" format-charset="SYMBOL_CHARSET" levelreset="true" legalstyle="false" startfrom="1" styleclass="Normal (list)" style="font-family:Symbol; font-size:10pt; color:#000000;">
      <li styleclass="Normal (list)"><text styleclass="Normal (list)" translate="true">DataWindow&lt;TViewModel&gt; =&gt; </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_MVVMProviders_WindowBehavior" styleclass="Normal (list)" translate="true">WindowBehavior</link></li>
      <li styleclass="Normal (list)"><text styleclass="Normal (list)" translate="true">UserControl&lt;TViewModel&gt; =&gt; </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_MVVMProviders_UserControlBehavior" styleclass="Normal (list)" translate="true">UserControlBehavior</link></li>
      <li styleclass="Normal (list)"><text styleclass="Normal (list)" translate="true">Page&lt;TViewModel&gt; =&gt; </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_MVVMProviders_NavigationPageBehavior" styleclass="Normal (list)" translate="true">NavigationPageBehavior</link></li>
    </list>
    <para styleclass="Normal"><text styleclass="Normal" translate="true">This means that you no longer have to derive user controls from the </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_UserControl" styleclass="Normal" translate="true">UserControl</link><text styleclass="Normal" translate="true"> to use the ability to solve the nested user controls problem. Or, if you are not happy with the endless possibilities of the </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_DataWindow" styleclass="Normal" translate="true">DataWindow</link><text styleclass="Normal" translate="true">, why not just creating a custom one without having to think about the MVVM integration.</text></para>
    <para styleclass="Heading1"><text styleclass="Heading1" translate="true">WindowBehavior</text></para>
    <para styleclass="Normal"><text styleclass="Normal" translate="true">The </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_MVVMProviders_WindowBehavior" styleclass="Normal" translate="true">WindowBehavior</link><text styleclass="Normal" translate="true"> class takes care of all the MVVM integrations of a window and a view model. So, where you previously had to derive a </text><text styleclass="Normal" style="font-style:italic;" translate="true">Window</text><text styleclass="Normal" translate="true"> implementation from </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_DataWindow" styleclass="Normal" translate="true">DataWindow</link><text styleclass="Normal" translate="true">, you can now create a new </text><text styleclass="Normal" style="font-style:italic;" translate="true">Window</text><text styleclass="Normal" translate="true"> like any application and then add this:</text></para>
    <para styleclass="Normal"><text styleclass="Normal" translate="true">The </text><link displaytype="text" defaultstyle="true" type="topiclink" href="P_Catel_Windows_Controls_MVVMProviders_WindowBehavior_Save" styleclass="Normal" translate="true">Save</link><text styleclass="Normal" translate="true"> and </text><link displaytype="text" defaultstyle="true" type="topiclink" href="P_Catel_Windows_Controls_MVVMProviders_WindowBehavior_Cancel" styleclass="Normal" translate="true">Cancel</link><text styleclass="Normal" translate="true"> properties are not obligate, and need the format </text><text styleclass="Normal" style="font-style:normal;" translate="true">of </text><text styleclass="Normal" style="font-style:italic;" translate="true">[controlname].[event]</text><text styleclass="Normal" translate="true">. By default, the </text><text styleclass="Normal" style="font-style:italic;" translate="true">Click</text><text styleclass="Normal" translate="true"> event is used, so if a button (or another control that should respond using the </text><text styleclass="Normal" style="font-style:italic;" translate="true">Click</text><text styleclass="Normal" translate="true"> event), the </text><text styleclass="Normal" style="font-style:italic;" translate="true">[controlname]</text><text styleclass="Normal" translate="true"> is sufficient.</text></para>
    <para styleclass="Code Example"><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&lt;</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">i:Interaction.Behaviors</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&gt;</text><br/><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">    </text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&lt;</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">catel:WindowBehavior</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true"> ViewModelType=&quot;</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">viewmodels:DemoWindowViewModel</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&quot; </text><br/><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">                          Save=&quot;</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">okButton.Click</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&quot; Cancel=&quot;</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">cancelButton.Click</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&quot;  /&gt;</text><br/><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&lt;/</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">i:Interaction.Behaviors</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&gt;</text></para>
    <para styleclass="Normal"><text styleclass="Normal" translate="true">Seems too easy right? Well, it is really all you have to do.</text></para>
    <para styleclass="Normal"><text styleclass="Normal" style="font-weight:bold;" translate="true">This looks great, but why is there still a DataWindow with this terrific solution?</text></para>
    <para styleclass="Normal"><text styleclass="Normal" translate="true">First of all, we have to think about all the people that are already using Catel. We don&apos;t want to break their code and provide backward compatibility. Updates to the logic will be applied to both the behavior and the viewbase because the logic is located in a separate class. Also, the </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_DataWindow" styleclass="Normal" translate="true">DataWindow</link><text styleclass="Normal" translate="true"> is truly a terrific class, which supports lots of customization and takes care of dumb generation of buttons and the </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_InfoBarMessageControl" styleclass="Normal" translate="true">InfoBarMessageControl</link><text styleclass="Normal" translate="true">.</text></para>
    <para styleclass="Notes"><text styleclass="Notes" translate="true">For more information, check out the the Catel.Examples.WPF.AdvancedDemo which shows the differences</text></para>
    <para styleclass="Heading1"><text styleclass="Heading1" translate="true">UserControlBehavior</text></para>
    <para styleclass="Normal"><text styleclass="Normal" translate="true">The </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_MVVMProviders_UserControlBehavior" styleclass="Normal" translate="true">UserControlBehavior</link><text styleclass="Normal" translate="true"> class takes care of all the MVVM integrations of a user control and a view model. So, where you previously had to derive a </text><text styleclass="Normal" style="font-style:italic;" translate="true">UserControl</text><text styleclass="Normal" translate="true"> implementation from </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_UserControl" styleclass="Normal" translate="true">UserControl</link><text styleclass="Normal" translate="true">, you can now create a new </text><text styleclass="Normal" style="font-style:italic;" translate="true">UserControl</text><text styleclass="Normal" translate="true"> like any application and then add this:</text></para>
    <para styleclass="Code Example"><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&lt;</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">i:Interaction.Behaviors</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&gt;</text><br/><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">    </text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&lt;</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">catel:UserControlBehavior</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true"> ViewModelType=&quot;</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">viewmodels:DemoWindowViewModel</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&quot; /&gt;</text><br/><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&lt;/</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">i:Interaction.Behaviors</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&gt;</text></para>
    <para styleclass="Normal"><text styleclass="Normal" style="font-weight:bold;" translate="true">This looks great, but why is there still a UserControl with this terrific solution?</text></para>
    <para styleclass="Normal"><text styleclass="Normal" translate="true">First of all, we have to think about all the people that are already using Catel. We don&apos;t want to break their code and provide backward compatibility. Also, the </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_UserControl" styleclass="Normal" translate="true">UserControl</link><text styleclass="Normal" translate="true"> implements the </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_MVVM_IViewModelContainer" styleclass="Normal" translate="true">IViewModelContainer</link><text styleclass="Normal" translate="true"> interface which allows chained view models in a hierarchy. If you don&apos;t need this, just go for the behavior. If you need hierarchy chains, either let the custom </text><text styleclass="Normal" style="font-style:italic;" translate="true">UserControl</text><text styleclass="Normal" translate="true"> implement it or use the </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_UserControl" styleclass="Normal" translate="true">UserControl</link><text styleclass="Normal" translate="true">.</text></para>
    <para styleclass="Normal"><text styleclass="Normal" translate="true">To support nested user controls and their validation, it is important to chain views together using the </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_MVVM_IViewModelContainer" styleclass="Normal" translate="true">IViewModelContainer</link><text styleclass="Normal" translate="true"> interface. You can choose not to do this, but then it is important to disable </text><link displaytype="text" defaultstyle="true" type="topiclink" href="P_Catel_Windows_Controls_MVVMProviders_Logic_UserControlLogic_SupportParentViewModelContainers" styleclass="Normal" translate="true">SupportParentViewModelContainers</link><text styleclass="Normal" translate="true"> for performance reasons (otherwise, the behavior will keep searching the visual tree for the parent view model).</text></para>
    <para styleclass="Notes"><text styleclass="Notes" translate="true">For more information, check out the the Catel.Examples.WPF.AdvancedDemo which shows the differences</text></para>
    <para styleclass="Heading1"><text styleclass="Heading1" translate="true">NavigationPageBehavior</text></para>
    <para styleclass="Normal"><text styleclass="Normal" translate="true">The </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_MVVMProviders_Logic_NavigationPageLogic" styleclass="Normal" translate="true">NavigationPageBehavior</link><text styleclass="Normal" translate="true"> class takes care of all the MVVM integrations of a page (used in navigation or browser based applications) and a view model. So, where you previously had to derive a </text><text styleclass="Normal" style="font-style:italic;" translate="true">Page</text><text styleclass="Normal" translate="true"> implementation from </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_Page" styleclass="Normal" translate="true">Page</link><text styleclass="Normal" translate="true">, you can now create a new </text><text styleclass="Normal" style="font-style:italic;" translate="true">Page</text><text styleclass="Normal" translate="true"> like any application and then add this:</text></para>
    <para styleclass="Code Example"><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&lt;</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">i:Interaction.Behaviors</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&gt;</text><br/><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">    </text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&lt;</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">catel:NavigationPageBehavior</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true"> ViewModelType=&quot;</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">viewmodels:DemoWindowViewModel</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&quot; /&gt;</text><br/><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&lt;/</text><text styleclass="Code Example" style="font-weight:bold; font-style:normal; color:#000080;" translate="true">i:Interaction.Behaviors</text><text styleclass="Code Example" style="font-weight:normal; font-style:normal; color:#000000;" translate="true">&gt;</text></para>
    <para styleclass="Normal"><text styleclass="Normal" style="font-weight:bold;" translate="true">This looks great, but why is there still a Page with this terrific solution?</text></para>
    <para styleclass="Normal"><text styleclass="Normal" translate="true">First of all, we have to think about all the people that are already using Catel. We don&apos;t want to break their code and provide backward compatibility. Also, the </text><link displaytype="text" defaultstyle="true" type="topiclink" href="T_Catel_Windows_Controls_Page" styleclass="Normal" translate="true">Page</link><text styleclass="Normal" translate="true"> class comes with more default functionality that you might be interested in.</text></para>
    <para styleclass="Notes"><text styleclass="Notes" translate="true">For more information, check out the the Catel.Examples.WPF.BrowserApplication which shows the differences</text></para>
  </body>
</topic>
